@charset "utf-8";

div.shadow {
  width: 1900px;
  height: 900px;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  text-align: center;
}

#logo
{position:absolute;top:40px;left:30px;}

Nom
{
position:absolute;
width:600px;
top:20px;
left:600px;
font-family:'A Gothique Time';
font-size: 80px;
}

Rubrique
{
position:absolute;
top:110px;
left:20px;
font-size: 40px;
font-family: 'Kingthings Gothique';
}

.CatArt
  {
position:absolute;  
top:116px;
left:140px;
width:100px;
height:36px;
font-size: 30px;
/* display: flex; */
text-align:center;
cursor:pointer;
text-decoration:none;
border:#000 1px solid;
background-color:#000;
color:#fff;
/*padding:4px 8px;*/
border-radius:5px; 
  }

Pseudo
{
position:absolute;
top:120px;
left:350px;
font-family:"PeterSchlemihl";	
font-size: 36px;
font-weight: 400;
}

Titre
{
position:absolute;
top:130px;
left:450px; 
font-style: italic;
font-size: 20px;
}

date
{position:absolute;top:130px;left:94%;}

video
{position:absolute;top:250px;left:400px;}

#iconeForm
{
position:absolute;
top:118px;
left:250px;
width:32px;
height:32px;
cursor: pointer;
}

#iconeSite
{
position:absolute;
top:118px;
left:300px;
width:32px;
height:32px;
cursor: pointer;
}

#line1
{position:absolute;top:10px;}

#line2
{position:absolute;top:106px;}

#line3
{position:absolute;top:420px;}

/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 100px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content */
.modalSite {
  display: none; /* Hidden by default */
  background-color: #fefefe;
  margin: auto;
  padding: 20px;
  border: 1px solid #888;
  width: 80%;
  animation: scale 0.8s;
}

/* Modal Content 2 */
.modalForm {
  display: none; /* Hidden by default */
  background-color: #fefefe;
  margin: auto;
  padding: 20px;
  border: 1px solid #888;
  width: 34%;
  animation: scale 0.8s;
}

@keyframes scale {
    from { scale: 0.3 }
    to   { scale: 1 }
}

/* The Close Button */
.close {
  color: #aaaaaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

#Form
{
  position:absolute;
  top:470px;
  left:1660px;
  width:300px;
}

#openCroll
{
  position:absolute;
  top:120px;
  left:1660px;
}

#Go
{position:absolute;top:118px;left:800px;}

#o
{ position:absolute;top:118px;left:1000px;}

#b
{ position:absolute;top:118px;left:1200px;}

#l
{ position:absolute;top:118px;left:1400px;}

#GoT
{position:absolute;top:105px;left:850px;}

#oT
{ position:absolute;top:105px;left:1050px;}

#bT
{ position:absolute;top:105px;left:1250px;}

#lT
{ position:absolute;top:105px;left:1450px;}

span {font-family:'Typewriter RusticRNH Regular'; font-size: 40px;}

paraphD
{
  position:absolute;
  top:160px;
  left:1520px;
  width:360px;
  text-justify: 200px;
}

paraphG
{
  position:absolute;
  top:160px;
  left:28px;
  width:350px;
}

Biographie
{
  position:absolute;
  top:160px;
  left:400px;
  width:1090px;
  text-justify: auto;
}

Communication
{
  position:absolute;
  top:476px;
  left:1520px;
  width:130px;
  text-justify: auto;
}

TextS {
  text-align: justify;
  font-family:'Typewriter RusticRNH Regular';
}
textarea {resize: none;}